/**
 * Created by 荆安喜 on 2017/8/28.
 */


$(function () {

    var ad = appData()
    var deviceId, deviceName,deviceType


    $(function () {
        //初始化渲染
        var parms = {
            deviceState: "-1",
            deviceName: "设备名称",
            deviceText: ""
        }
        ad.selectList('KMGA_DEVICE_LIST', {}, darwDeviceList);

        //初始化拓扑图
        ad.selectList('KMGA_DEVICE_TOPOLOGY', parms, darwTopologyMap)

        $('#topoSearch').on('click', topoSearch)
    })

    //渲染设备列表
    function darwDeviceList(data) {
        $('.panel-title label').remove()
        for (var key in data) {
            $('.panel-title').append("<label>" + data[key].name + "  " + "<em>" + data[key].running + "/" + data[key].total + "</em></label>")
        }
    }

    //检索拓扑图
    function topoSearch(d, i) {
        var parms = {
            deviceState: $('#deviceState').val(),
            deviceName: $('#deviceName').val(),
            deviceText: $('#deviceText').val()
        }

        ad.selectList('KMGA_DEVICE_TOPOLOGY', parms, darwTopologyMap)
    }

    //渲染拓扑图
    function darwTopologyMap(data) {
        var iconStyle = {
            '0': 'fc-gray',
            '1': 'fc-warning',
            '2': ''
        }
        var iconClass = {
            'probe': 'icon-server-wifi',
            'desensitization': 'icon-server-db',
            'ops': 'icon-server'
        }
        for (var key in data) {
            $('#' + key).empty()
            data[key].forEach(function (d, i) {
                var str = `<li data-id="${d.id}" data-type="${key}"  class="${iconStyle[d.type]}"   data-name="${d.name}"   ><i class=${iconClass[key]}></i><span>${d.name}</span></li>`
                $('#' + key).append(str)
            })
        }
        $(".scrollbar").mCustomScrollbar({
            horizontalScroll: true,
            autoHideScrollbar: true,
            advanced: {
                autoExpandHorizontalScroll: true
            }
        });
    }


    //右键拓扑图配置页面
    $(".lv2").unbind("mousedown").bind("contextmenu", function (e) {
        e.preventDefault();
        return false;
    });
    $(".lv2").unbind("mousedown").bind("mousedown", function (event) {
        if (event.which == 3) {
            deviceId = $(event.target.parentElement).attr('data-id')
            deviceName = $(event.target.parentElement).attr('data-name')
            deviceType= $(event.target.parentElement).attr('data-type')
            if (deviceId != undefined) {
                var offset = $(this).offset();
                var relativeX = (event.pageX - offset.left + 240);
                var relativeY = (event.pageY - offset.top + 100);

                $(".rightmenu").css({"left": relativeX, "top": relativeY}).show();
            }
        }
        if (event.which == 1) {
            $(".rightmenu").hide();
        }
    });


    //ui 样式
    $(".lv2 ul").on("click", "li", function () {
        $(".rightmenu").hide();
        $(this).hasClass('checked') ? $(this).removeClass('checked') : $(this).addClass('checked');
    })

    $(".dropdown").on("click", "button", function () {
        $(this).parent().hasClass('open') ? $(this).parent().removeClass('open') : $(this).parent().addClass('open');
    })


    $("#urllist").on("change", function () {
        $("#iframe").prop("src", $(this).val());
    })



    $(".rightmenu ul li:eq(2)").on('click',function () {
        var url = window.location.href.split('?')[0];
        window.open(url+'?page=views/safeApp/homePage/jumpHtml'+ "&" + deviceId)
    })





    $(".rightmenu ul li:eq(3)").on("click", function () {
        $("#delete").show();
    })


    $(".dialog .close,#cancel").on("click", function () {
        $(".dialog").hide();
    })

    //设备日志
    $(".rightmenu ul li:eq(1)").on("click", function () {
        var url = window.location.href.split('?')[0];
        var select={
            'probe': '2',
            'desensitization': '3',
            'ops': '4'
        }
        window.open(url + '?page=views/safeApp/logManage/system'+select[deviceType] + "&id=" + deviceId+"&type="+deviceType);
        $(".rightmenu").hide();
    })
    //设备信息
    $(".rightmenu ul li:eq(0)").on('click', function () {
        $("#info").show();
        ad.sel('KMGA_DEVICE_INFO', {id: deviceId, time: 0}, function (data) {
            $.get('scripts/app/safe/homePage/deviceInfo.tmpl', function (tmpl) {
                $('#topInfoName').text(data.name)
                $('.inline-list').empty()
                $.tmpl(tmpl, data).appendTo('.inline-list');
            })
            var myChart1 = echarts.init(document.getElementById('chart1'));
            myChart1.setOption(lineDatas({
                name: "cpu使用率曲线",
                data: [{data: data.lineS.cpu.dataY, title: data.lineS.cpu.name}],
                date: data.lineS.dateX,
            }), true);


            var myChart2 = echarts.init(document.getElementById('chart2'));
            myChart2.setOption(lineDatas({
                name: "内存使用率曲线",
                data: [{data: data.lineS.memory.dataY, title: data.lineS.memory.name}],
                date: data.lineS.dateX,
            }), true);


            var myChart3 = echarts.init(document.getElementById('chart3'));
            myChart3.setOption(lineDatas({
                name: "磁盘用量曲线",
                data: [{data: data.lineS.diskUse.dataY, title: data.lineS.diskUse.name}],
                date: data.lineS.dateX,
            }), true);


            var myChart4 = echarts.init(document.getElementById('chart4'));
            myChart4.setOption(lineDatas({
                name: "io输入输出曲线",
                data: [{
                    data: data.lineS.ioInfo.in.dataY,
                    title: data.lineS.ioInfo.in.name
                }, {data: data.lineS.ioInfo.out.dataY, title: data.lineS.ioInfo.out.name}],
                date: data.lineS.dateX,
            }), true);
        })

    })
    //绘图数据梳理
    function lineDatas(parms) {
        var colors = ['red', 'green']
        var series = []
        parms.data.forEach(function (d, i) {
            var serie = {
                name: '',
                type: 'line',
                smooth: true,
                symbol: 'none',
                sampling: 'average',
                itemStyle: {
                    normal: {
                        color: ''
                    }
                },
                areaStyle: {
                    normal: {
                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                            offset: 0,
                            color: 'rgb(255, 158, 68)'
                        }, {
                            offset: 1,
                            color: 'rgb(255, 70, 131)'
                        }])
                    }
                },
                data: ""
            }
            serie.name = d.title
            serie.data = d.data
            serie.itemStyle.normal.color = colors[i]
            series.push(serie)
        })


        var option = {
            tooltip: {
                trigger: 'axis',
                position: function (pt) {
                    return [pt[0], '10%'];
                }
            },
            title: {
                left: 'center',
                text: parms.name,
            },

            xAxis: {
                type: 'category',
                boundaryGap: false,
                data: parms.date
            },
            yAxis: {
                type: 'value',
                boundaryGap: [0, '100%']
            },

            series: series
        }

        return option

    }

    //删除设备
    $('#delS').on('click', function (d, i) {
        ad.insert('KMGA_DEVICE_DEL', {id: deviceId}, function () {
            topoSearch()
            $("#delete").hide();
            $(".rightmenu").hide();
        })
    })

})
    
    
